<template>
<table class="table" border="1">
    <tr>
        <td>用户名：</td>
        <td>
            <input type="text" v-model="name"/>
        </td>
    </tr>
    <tr>
            <td>密码：</td>
            <td>
                <input type="password" v-model="pwd"/>
            </td>
    </tr>
    <tr>
            <td colspan="2">
                <input type="button" value="登录" @click="deng()" style="background-color:aquamarine;"/>
            </td>          
    </tr>
</table>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import { useRouter } from 'vue-router';
const name = ref('');
const pwd = ref('');
const router = useRouter();
const deng = () => { 
    if (name.value == '')
    {
        alert('用户名不能为空');
        return;
    }
    if (pwd.value == '')
    {
        alert('密码不能为空');
        return;
    }
    // 登录验证
    // 假设用户名为admin，密码为123456
    if (name.value == 'admin' && pwd.value == '123456')
    {
        alert("登录成功")
        router.push({
            name: 'showLogin',
            params: {
                name: name.value,
                pwd: pwd.value
            }
        })
    }
}

</script>